<template>
    <el-card style="width: 500px;">
        <el-form label-width="80px" size="small">
            <div style="text-align: center; margin: 10px 0"> <el-upload class="avatar-uploader"
                    action="http://localhost:9090/file/upload" :show-file-list="false"
                    :on-success="handleAvatarSuccess"> <img v-if="form.avatarUrl" :src="form.avatarUrl" class="avatar">
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i> </el-upload> </div>
            <el-form-item label="用户名">
                <el-input v-model="form.username" disabled autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="昵称">
                <el-input v-model="form.nickname" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="邮箱">
                <el-input v-model="form.email" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="电话">
                <el-input v-model="form.phone" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="地址">
                <el-input v-model="form.address" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="save">保 存</el-button>
            </el-form-item>
        </el-form>
    </el-card>
</template>

<script>
export default {
    name: "Person",
    data() {
        return {
            form: {},
            user: localStorage.getItem("user") ? JSON.parse(localStorage.getItem("user")) : {}
        }
    },
    created() {
        this.request.get("/user/username/" + this.user.username).then(res => {
            if (res.code == '200') {
                this.form = res.data
            }
        })
    },
    methods: {
        save() {
            this.request.post("/user", this.form).then(res => {
                if (res) {
                    this.$message.success("保存成功")
                } else {
                    this.$message.error("保存失败")
                }
            })
        }
    }
}
</script>

<style scoped></style>
